<%@page import="bll.EnumName"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ page import="java.util.*,util.*,dal.*,model.*, bll.*"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Create New Project</title>
<link rel="stylesheet" href="css/common.css" />
<link rel="stylesheet" href="css/inputForm.css" />
<link rel="stylesheet" href="css/listForm.css" />
<link rel="stylesheet" href="css/jquery-ui-1.8.14.custom.css" type="text/css" />
<link rel="stylesheet" href="css/hyjack.css" type="text/css" />
<link rel="stylesheet" href="css/datepicker.css" type="text/css" />
<link rel="stylesheet" href="css/themes/ui-lightness/jquery.ui.all.css" />
<link rel="stylesheet" href="css/jquery-ui-timepicker.css" type="text/css" />
<link rel="stylesheet" href="css/jquery-datepicker.css" />
<link rel="stylesheet" href="css/jquery-dialog.css" />
<link rel="stylesheet" href="css/jquery.drag.drop.css" />


<script language="javascript" type="text/javascript" src="js/datepicker.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.14.custom.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.hyjack.select.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.ui.core.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.ui.widget.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.ui.timepicker.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.ui.datepicker.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.hyjack.js"></script>
<script language="javascript" type="text/javascript" src="js/ajaxQuickInsert.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.numeric.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.ui.tools.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.drag.drop.js"></script>


<script language="javascript" type="text/javascript">


	$(document).ready(function() {
		$('input[type="file"]').dropUpload({
			'uploadUrl'	: 'upload',
			'uploaded'	: function(resp) {	
				alert('files uploaded!');
			},
			'dropClass' 	: 'file-drop',
			'dropHoverClass': 'file-drop-hover',
			'defaultText'  	: 'Drop your files here to upload and display!',
			'hoverText'	: 'Let go to upload!'
		});
	});


	
</script>
</head>
<body>

<div class="divContainer">

	
		<table class="tblInput">
			<tr>
				<td class="inputHeader">Up load file</td>
			</tr>
			<tr><td style="padding-left: 400px; padding-right: 400px;">
				
				<table width="485" border="1" cellspacing=0 cellpadding=5>
					<tr bgcolor="#F2F2F2">

						<td class="tdFieldInput" colspan="2">
							
							<form action="" method="post" enctype="multipart/form-data">
								<input type="file" name="files[]" multiple="multiple" onchange="imagesSelected(this.files)" >
<!-- 								<input type="submit" value="Upload!"> -->
							</form>
							
						</td>
					</tr>		
					<tr>
						<td align="left" height="300" width="300" ondragenter="return false" ondragover="return false" ondrop="dropIt(event)"> 
							<span>Drop files here to display only</span>   
							<output id="thumbs"></output> 
						</td>
					</tr>		
				</table>	
				
			</td></tr>
			
				</table>
				

</div>
</body>
</html>